<template>
  <el-dialog
    v-model="props.show"
    :key="props.show"
    title="设置排序"
    @close="emit('hide', false)"
  >
    <template #default>
      <div class="qu-input">
        <span>排序:</span>
        <el-input v-model="sort.sort"></el-input>
      </div>
    </template>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="emit('hide', false)">取消</el-button>
        <el-button type="primary" @click="updateSort">确认</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup lang="ts">
const props = defineProps({
  show: {
    type: Boolean,
    default: false,
  },
  sort: {
    type: Object,
    default: {},
  },
});
const updateSort = () => {
  emit("hide", true, props.sort.sort);
};

const emit = defineEmits(["hide"]);
</script>

<style scoped lang="less">
.qu-input {
  display: flex;
  align-items: center;
  span {
    width: 50px;
  }
  :deep(.el-input) {
    width: 400px;
  }
}
</style>
